MOTION SPEC · anasaq.me

مواصفات الحركة وخريطة التحكم

لغة حركة واحدة عبر الموقع: هادئة، عكسية عند الصعود والنزول، مبنية على المنحنى نفسه. كل سلوك موثّق بمحفّزه ومدّته ومسافته، وكل تأثير يُتحكم به من لوحة «الحركة» في Tweaks.

المنحنى الأساسي

cubic-bezier(.22,.61,.36,1)

خروج ناعم (ease-out) — يبدأ بثقة وينتهي بهدوء

700–900ms

مدة الظهور

16–24px

مسافة الارتفاع

ظهور واحد لكل قسم

السلوكيات الحيّة

ظهور وارتفاع مع تلاشي التمويه

الظهور العكسي · sectionReveal

.data-rv

opacity + translateY + scale(.985) + blur. يظهر عند الدخول، ويعود للاختفاء عند الخروج نحو الحافة التي غادر منها — فيُعاد تشغيله صعوداً ونزولاً.

انجراف الصور · imageParallax

bg-position

إزاحة خفيفة لموضع خلفية الصورة أثناء مرورها في الشاشة (±30px) لإيهام العمق، دون كسر التخطيط.

أنس

التوقيع المتلاشي · stickyHero

.data-sig

في غرفة «مرّت من هنا»: علامة الاسم ترتفع وتكبر وتتلاشى مع التمرير — تجسيد بصري لفكرة «بلا توقيع».

0 → 60+

الشريط + العدّاد · header/count

progress

شعيرة تقدّم نحاسية أعلى الصفحة، شريط علوي يتحوّل لزجاج شفاف عند التمرير، وأرقام تعدّ تصاعدياً بالإنجليزية عند ظهورها.

خريطة التحكم · Tweaks

كل مفتاح في لوحة «الحركة» وما يتحكم به. المجموعة كلها تحت مفتاح رئيسي واحد، مع خيار احترام تفضيل «تقليل الحركة».

{{ r.key }}